<template>
	<!-- 购物车订单 -->
	<view class="orderItem">
		<view class="orderItem-shopImage">
			<image :src="imagesUrls(orderInfo.goods.fileUrl)" style="width: 160rpx; height: 160rpx; background-color: #f3f3f3"></image>
		</view>
		<view class="orderItem-info">
			<view class="info-name">{{ orderInfo.goods.name }}</view>
			<view class="info-gg">规格:{{ orderInfo.goods.spec }}</view>
			<view class="info-tags">
				<uni-tag :text="orderInfo.goods.mediaName" type="error" size="mini" />
				<uni-tag :text="orderInfo.goods.artid ? '云仓发货' : '商家自营'" type="error" size="mini" style="margin-left: 8rpx" :inverted="true" />
			</view>
			<view class="info-prices">
				<view class="prices">
					<text style="font-size: 24rpx">￥</text>
					{{ computedPrice }}
				</view>
				<view class="numsBox">
					<u-number-box :step="1" button-size="26" :value="orderInfo.num" @change="changeNum"></u-number-box>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import { imageUrl } from '../../utils/tools.js';
export default {
	name: 'hwxcOrderItem',
	props: {
		// 订单信息
		orderInfo: {
			type: Object,
			default: () => {}
		}
	},
	mounted() {
		this.ratio = this.$store.state.commInitInfo.yyd_ratio;
	},
	computed: {
		computedPrice() {
			if (this.orderInfo.goods.type == 0) {
				if(!this.orderInfo.goods.store_id){
					let pic = this.orderInfo.goods.price != '0.00' ? this.orderInfo.goods.price : this.orderInfo.goods.saleprice;
					return ((Number(pic) + (Number(pic) * this.ratio) / 100)).toFixed(2);
				}else{
					return (Number(this.orderInfo.goods.price != '0.00' ? this.orderInfo.goods.price : this.orderInfo.goods.saleprice)).toFixed(2);
				}
				
			} else {
				return (Number(this.orderInfo.goods.price != '0.00' ? this.orderInfo.goods.price : this.orderInfo.goods.saleprice)).toFixed(2);
			}
		}
	},
	data() {
		return {
			ratio: 0
		};
	},
	methods: {
		changeNum(newValue) {
			this.$emit('updataOrder', {
				id: this.orderInfo.id,
				num: newValue.value
			});
		},
		imagesUrls(fileUrl) {
			return imageUrl(fileUrl);
		}
	}
};
</script>

<style scoped lang="scss">
.orderItem {
	display: flex;
	box-sizing: border-box;
	padding: 20rpx 0px;
	border-bottom: 1px #f3f3f3 solid;
	flex: 1;
	margin-left: 10px;
	.orderItem-shopImage {
		width: 180rpx;
	}

	.orderItem-info {
		width: 430rpx;
		display: flex;
		flex-direction: column;
		.info-name {
			font-size: 26rpx;
			font-weight: bold;
			display: -webkit-box;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
			overflow: hidden;
		}

		.info-gg {
			font-size: 24rpx;
			color: #999;
			margin: 10rpx 0px;
		}

		.info-tags {
			margin-bottom: 12rpx;
		}

		.info-prices {
			display: flex;
			justify-content: space-between;
			.prices {
				color: #e43927;
				font-size: 32rpx;
			}
			.numsBox {
			}
		}
	}
}
</style>
